<?php
//模拟闹钟功能,需要1.mp3作为响铃音频文件
header("content-type:text/html;charset=utf-8");
include "../../public/config/config.php";
session_start();
if($_POST){
	if($_POST['time'] !=''){
		$tt=$_POST['time'];
		$tt=explode(".", $tt);
		if(count($tt)==1){
			$tts=$tt[0];
		}elseif(count($tt)==2){
			$tts=$tt[0]*60+$tt[1];
		}elseif(count($tt)==3){
			$tts=$tt[0]*3600+$tt[1]*60+$tt[2];
		}else{
			echo "<script>";
			echo "alert('时间格式不正确!');";
			echo "window.location.href='naoz.php';";
			echo "</script>";
			exit;
		}
		//需要时间输入
		$cut=time();
		$pname=$_POST['name'] ? $_POST['name'] : "默认项";
		$_SESSION["t".$cut]['name']=$pname;
		$_SESSION["t".$cut]['time']=$tts + time();
	}else{
		echo "<script>";
		echo "alert('必须输入时间!');";
		echo "window.location.href='naoz.php';";
		echo "</script>";
	}
}
if($_GET['deltd']){
	$td=$_GET['deltd'];
	unset($_SESSION[$td]);
}
if($_GET['delall']){
	session_destroy();
	echo "<script>";
	echo "alert('所有定时都被清除！');";
	echo "window.location.href='naoz.php';";
	echo "</script>";
}
$arrt=$_SESSION;
foreach($_SESSION as $k=>$v){
	$arras[$k]=$v['time'];
}
asort($arras);
asort($arrt);
//echo "<pre>";
//print_r($_SESSION);
//print_r($arras);
//echo "</pre>";
?>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
	<title>网页版在线定时计时器 - 闹钟 -- <?php echo $cfg_indexname;?></title>
	
	<!-- Bootstrap -->
	<link href="/public/css/bootstrap.min.css" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="naoz.css"/>
	
	<!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 -->
	<!-- 警告：通过 file:// 协议（就是直接将 html 页面拖拽到浏览器中）访问页面时 Respond.js 不起作用 -->
	<!--[if lt IE 9]>
	<script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
	<![endif]-->
</head>
<body>
<div class="container main">
	<ol class="breadcrumb bg_eee">
		<li><a href="/index.php">首页</a></li>
		<li><a href="/diy">我的DIY</a></li>
		<li class="active">网页版在线定时计时器</li>
	</ol>
	<h1 class="text-center bg-primary lhei">网页版在线定时计时器 - 闹钟</h1>
	<table class="table table-bordered">
		<tr>
			<th>排序</th>
			<th>倒计时项</th>
			<th>剩余时间</th>
			<th>终止节点</th>
			<th>操作</th>
		</tr>
<?php
foreach($arras as $k=>$v){
	$i++;
?>
		<tr>
			<td><?php echo $i;?></td>
			<td id="tdn-<?php echo $i?>"><?php echo $arrt[$k]['name']?></td>
			<td id="td-<?php echo $i?>"></td>
			<td id="tdh-<?php echo $i?>" class="tdh" ><?php echo $v;?></td>
			<td><a href="naoz.php?deltd=<?php echo $k?>">删除</a></td>
		</tr>
<?php
}
if(!$_SESSION){
	echo "<tr><td colspan='5'>现在没有定时项目，快去添加定时吧</td></tr>";
}
?>
	</table>
	<audio id="mzc" loop="loop" controls="controls" src="1.mp3">不支持</audio><a href="naoz.php?delall=all" class="btn btn-danger">清除所有定时</a>
	<form action="naoz.php" method="post">
		倒计时项：<input type="text" name="name" id="" value="" placeholder="取个名字" /><br /><br />
		倒计时间：<input type="text" name="time" id="" value="" placeholder="输入时间，用点分割" />例如：1.20.50表示1小时20分钟50秒后响铃；而20.50表示20分钟50秒后响铃<br /><br />
		<input type="submit" class="btn btn-info" value="添加定时"/>
	</form>
</div>
</body>
<script type="text/javascript">
	function tdjj(i){
		var timestamp=new Date().getTime();
		var ts=timestamp/1000;
		var tz=Math.floor(ts);
		var tdid=document.getElementById("td-"+i);
		var tdhid=document.getElementById("tdh-"+i);
		var tdhval=tdhid.innerHTML;
		var tdend=tdhval-tz;
		if(tdend>0){
			var tdm=Math.floor(tdend/60);
			if(tdm<120){
				var tds=tdend%60;
				tdid.innerHTML=tdm+" 分 "+tds+" 秒 ";
			}else{
				var tdh=Math.floor(tdm/60);
				var tdmm=tdm%60;
				var tds=tdend%60;
				tdid.innerHTML=tdh+" 时"+tdmm+" 分 "+tds+" 秒 ";
			}
		}
		if(tdend<0){
			tdend=Math.abs(tdend);
			var tdm=Math.floor(tdend/60);
			var tds=tdend%60;
			tdid.innerHTML="过时 : "+tdm+" 分 "+tds+" 秒 ";
		}
		if(tdend==0){
			var mp3=document.getElementById("mzc");
			mp3.play();
			var tdn=document.getElementById("tdn-"+i);
			var tdname=tdn.innerHTML;
			alert(tdname);
		}
	}
	var iend=<?php echo count($arrt)+1;?>;
	for(var i=1;i<iend;i++){
		setInterval("tdjj("+i+")",1000);
	}
</script>
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script type="text/javascript" src="/public/js/jquery-3.3.1.min.js"></script>
<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script type="text/javascript" src="/public/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/public/js/footer.js"></script>
</html>